import 'package:flutter/material.dart';

class GoodsItemType {
  late bool isSelected;
  final int productId;
  final String imageUrl;
  final String productName;
  final double price;
  int quantity;

  GoodsItemType(
    this.isSelected,
    this.productId,
    this.imageUrl,
    this.productName,
    this.price,
    this.quantity,
  );
}

class GoodsDetail extends StatefulWidget {
  const GoodsDetail({super.key});

  @override
  State<GoodsDetail> createState() => _GoodsDetailState();
}

class _GoodsDetailState extends State<GoodsDetail> {
  List<GoodsItemType> goodsItems = [
    GoodsItemType(
      true,
      10125977161106,
      'https://img13.360buyimg.com/img/jfs/t1/279305/28/13378/172911/67eb4c90F81c1db34/af1de9f0614342d7.jpg!q70.dpg.webp',
      "【精致可爱】黄鸭泡面碗不锈钢饭盒饭碗滤水学生宿舍方便面碗礼品 小麦泡面碗加餐具",
      20.0,
      33,
    ),
    GoodsItemType(
      false,
      10118509424938,
      'https://img10.360buyimg.com/img/jfs/t1/278073/40/13914/99051/67eb50faF8e547312/a3af7845c5188a92.jpg!q70.dpg.webp',
      "【31只勺子】厨房不锈钢加厚韩式勺家用可爱汤勺网红勺儿童圆勺羹 3支装",
      20.0,
      2,
    ),
    GoodsItemType(
      false,
      10118509424938,
      'https://img10.360buyimg.com/img/jfs/t1/272759/3/14083/72443/67eb50f9Fbeee3f5c/36761e6ad2329fc9.jpg!q70.dpg.webp',
      "【31只勺子】厨房不锈钢加厚韩式勺家用可爱汤勺网红勺儿童圆勺羹 3支装",
      20.0,
      2,
    ),
    GoodsItemType(
      false,
      10118509424938,
      'https://img10.360buyimg.com/img/jfs/t1/274218/32/13592/75834/67eb50f4Ffd6a8a92/88b4f0d52afed98f.jpg!q70.dpg.webp',
      "【31只勺子】厨房不锈钢加厚韩式勺家用可爱汤勺网红勺儿童圆勺羹 3支装",
      20.0,
      2,
    ),
    GoodsItemType(
      false,
      10118509424938,
      'https://img10.360buyimg.com/img/jfs/t1/274218/32/13592/75834/67eb50f4Ffd6a8a92/88b4f0d52afed98f.jpg!q70.dpg.webp',
      "【31只勺子】厨房不锈钢加厚韩式勺家用可爱汤勺网红勺儿童圆勺羹 3支装",
      20.0,
      2,
    ),
    GoodsItemType(
      false,
      10118509424938,
      'https://img10.360buyimg.com/img/jfs/t1/274389/24/14080/90109/67eb50f0F8892555e/a2dd9328d0f8b128.jpg!q70.dpg.webp',
      "【31只勺子】厨房不锈钢加厚韩式勺家用可爱汤勺网红勺儿童圆勺羹 3支装",
      20.0,
      2,
    ),
    GoodsItemType(
      false,
      10118509424938,
      'https://img14.360buyimg.com/img/jfs/t1/274097/1/13058/12349/67eb50efF051443a9/837ad0113185b5ee.jpg!q70.dpg.webp',
      "【31只勺子】厨房不锈钢加厚韩式勺家用可爱汤勺网红勺儿童圆勺羹 3支装",
      20.0,
      2,
    ),
  ];

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: SafeArea(
        child: CustomScrollView(
          slivers: [
            //上半部分
            SliverToBoxAdapter(
              child: Column(
                children: [
                  //商品图片
                  Image.network(
                    'https://m.360buyimg.com/mobilecms/s750x750_jfs/t1/283677/22/17679/40876/67f87c98F12cc9c44/142fbad5a9ac3175.jpg!q80.dpg',
                    width: double.infinity,
                  ),
                  //活动介绍
                  Container(
                    padding: EdgeInsets.only(left: 20),
                    height: 50,
                    color: Colors.red,
                    child: Row(
                      children: [
                        Text(
                          '618',
                          style: TextStyle(
                            color: Colors.white,
                            fontSize: 24,
                            fontWeight: FontWeight.w700,
                          ),
                        ),
                        Padding(
                          padding: EdgeInsets.only(left: 10),
                          child: Text(
                            '30日晚8点开启',
                            style: TextStyle(
                              color: Colors.white,
                              fontSize: 18,
                              fontWeight: FontWeight.w100,
                            ),
                          ),
                        ),
                      ],
                    ),
                  ),
                  //商品简介
                  Container(
                    padding: EdgeInsets.symmetric(horizontal: 20),
                    child: Column(
                      // mainAxisAlignment: MainAxisAlignment.start,
                      crossAxisAlignment: CrossAxisAlignment.start,
                      children: [
                        Row(
                          children: [
                            Text(
                              '￥8199.00',
                              style: TextStyle(
                                color: Colors.red,
                                fontSize: 30,
                                fontWeight: FontWeight.w900,
                              ),
                            ),
                            Container(
                              padding: EdgeInsets.all(8),

                              decoration: BoxDecoration(
                                // 设置背景色
                                color: Colors.redAccent,
                                borderRadius: BorderRadius.circular(
                                  5.0,
                                ), // 设置圆角弧度
                              ),

                              child: Text(
                                '到手价',
                                style: TextStyle(
                                  color: Colors.white,
                                  fontSize: 16,
                                  fontWeight: FontWeight.w900,
                                ),
                              ),
                            ),
                          ],
                        ),
                        Text(
                          'HUAWEI Pura X 新品手机 1610阔型屏 鸿蒙操作系统5 折叠屏手机 华为鸿蒙智能手机 幻影黑 12GB+512GB 官方标配',
                          textDirection: TextDirection.ltr,
                          style: TextStyle(
                            fontSize: 16,
                            fontWeight: FontWeight.w700,
                          ),
                          textAlign: TextAlign.center,
                          maxLines: 2,
                          overflow: TextOverflow.ellipsis,
                        ),
                        Text('近60天最低价'),
                        //排行榜
                        Container(
                          margin: EdgeInsets.only(top: 10),
                          decoration: BoxDecoration(
                            color: const Color.fromARGB(255, 255, 196, 216),
                            borderRadius: BorderRadius.circular(5.0),
                          ),
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.spaceBetween,
                            children: [
                              Image.network(
                                'https://img10.360buyimg.com/img/jfs/t1/20724/31/20118/5100/6386d180Ef7435661/b73a0d4e3f653a22.png',
                                width: 100,
                              ),
                              Text(
                                'ins风手机热卖榜第6名',
                                style: TextStyle(
                                  color: Colors.red,
                                  fontSize: 16,
                                ),
                              ),
                              Image.network(
                                'https://m.360buyimg.com/rank/jfs/t1/206038/6/18674/1888/61bc390aE2a46f19b/321efee30a5a8e65.png',
                                width: 20,
                              ),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                  //分享
                  SizedBox(
                    height: 50,
                    child: Row(
                      children: [
                        Expanded(
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Image.network(
                                'https://img11.360buyimg.com/img/jfs/t1/185923/19/38125/325/64fad71dFeef526f9/f11f072077880807.png',
                                width: 20,
                              ),
                              Text('分享', style: TextStyle(fontSize: 16)),
                            ],
                          ),
                        ),
                        Expanded(
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Image.network(
                                'https://img11.360buyimg.com/img/jfs/t1/185923/19/38125/325/64fad71dFeef526f9/f11f072077880807.png',
                                width: 20,
                              ),
                              Text('分享', style: TextStyle(fontSize: 16)),
                            ],
                          ),
                        ),
                        Expanded(
                          child: Row(
                            mainAxisAlignment: MainAxisAlignment.center,
                            children: [
                              Image.network(
                                'https://img11.360buyimg.com/img/jfs/t1/185923/19/38125/325/64fad71dFeef526f9/f11f072077880807.png',
                                width: 20,
                              ),
                              Text('分享', style: TextStyle(fontSize: 16)),
                            ],
                          ),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
            //商品详情
            SliverList(
              delegate: SliverChildBuilderDelegate((
                BuildContext context,
                int index,
              ) {
                return ListTile(
                  contentPadding: EdgeInsets.zero, // 去除内边距
                  leading: null, // 去掉leading
                  trailing: null, // 去掉trailing
                  title: Image.network(
                    goodsItems[index].imageUrl,
                    width: double.infinity,
                  ),
                );
              }, childCount: goodsItems.length),
            ),
          ],
        ),
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: [
          BottomNavigationBarItem(
            icon: IconTheme(
              data: IconThemeData(size: 40),
              child: Icon(Icons.add_shopping_cart),
            ), // 首页图标
            label: '',
          ),
          BottomNavigationBarItem(
            icon: IconTheme(
              data: IconThemeData(size: 28),
              child: Icon(Icons.add),
            ),
            label: '加入购物车',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.payment), // 购物车图标
            label: '购买',
          ),
        ],
      ),
    );
  }
}
